<template>
  <div class="card-out">
  <div class="card-box">
      <image class="image"  mode="aspectFill" :src="item.img"></image>
    <div style="font-size: 25rpx;text-align: center">{{item.title}}</div>
      <div class="title">
        <i class="iconfont">&#xf0002;<i style="font-size: 20rpx">4000</i></i>
        <i class="iconfont">&#xe6ba;<i style="font-size: 20rpx">29</i></i>
        <i class="iconfont"><i style="color: #ee3e84">&#xe671;</i><i style="font-size: 20rpx">561</i></i>
      </div>
  </div>
  </div>
</template>

<script>
export default {
  props: ['item'],
  data () {
    return {

    }
  }
}
</script>

<style lang="scss" scoped>

  .image{
    width: 300rpx; height: 200rpx; background-color: #eeeeee;
  }

  .card-out{
    padding:10px 5px ;
  }
  .card-box{
    width: 300rpx;
    padding: 25rpx;
    box-shadow: 0 2px 3px #eee;



  }
  .title{
    color: #aaa;
    height: 35rpx;
    display: flex;
    flex-direction: row;
    justify-content:flex-end;
  }
</style>
